<template>
  <div id="app" v-if="isInit">
    <mainHeader></mainHeader>
    <div class="rebirthealth-warp">
      <router-view></router-view>
    </div>
    <mainFooter></mainFooter>
    <a
      class="zhineng-kefu"
      target="blank"
      href="https://tb.53kf.com/code/client/1688aaad8d16abc7203c472cf00a96602/1"
    ></a>
    <div v-show="showBg" class="right-bottom-bg-wrap"></div>
  </div>
</template>
<script>
import mainHeader from "./components/main-header.vue";
import mainFooter from "./components/main-footer.vue";
import api from "@/api/utils";
import api2 from "@/api/login";
export default {
  name: "App",
  data() {
    return {
      showBg: false,
      isInit: false,
    };
  },
  components: {
    mainHeader,
    mainFooter,
  },
  async created() {
    await this.init();
    this.isInit = true;
  },
  mounted() {
    let route = this.$route.name;
    if (route == "Home") {
      this.showBg = true;
    }
  },
  updated() {
    let route = this.$route.name;
    if (route == "Home") {
      this.showBg = true;
    }
  },
  methods: {
    async init() {
      
      let refToken = this.$store?.state.refToken;
      if (refToken) {
        await this.refreshToken(refToken);
        this.getUserInfo();
        let timer = setInterval(() => {
          let newRefToken = this.$store.state.refToken;
          if (newRefToken) {
            this.refreshToken(newRefToken);
          }
        }, 10 * 60 * 1000);
        this.$store.commit("SET_TIMER", timer);
      }
      this.$store.dispatch("loadRegionTree");
      this.$store.dispatch("getConfigData");
      // this.$store.dispatch("initServeContent");
    },
    async getUserInfo() {
      let res = await this.$http.get(api2.getUserInfo);
      if (res && res.code == 0) {
        this.$store.commit("SET_USER", res.data);
      } else {
        this.$message.error(res.msg || this.$t("网络错误"));
      }
    },
    async refreshToken(refToken) {
      let res = await this.$http.post(
        `${api.refreshToken}?refreshToken=${refToken}`
      );
      if (res && res.code == 0) {
        this.$store.commit("SET_TOKEN", res.data.accessToken);
        this.$store.commit("SET_REF_TOKEN", res.data.refreshToken);
      } else {
        this.$message.error(res.msg || this.$t("网络错误"));
      }
    },
  },
};
</script>
<style>
#app {
  width: 100%;
  min-height: 100%;
  background: #131e32;
  overflow: hidden;
}
.right-bottom-bg-wrap {
  width: 20.11rem;
  height: 25.28rem;
  background: url("./assets/img/right-bg.png") no-repeat center center / 100%
    100%;
  position: absolute;
  right: 0;
  bottom: 0;
}
.rebirthealth-warp {
  width: 100%;
  min-height: 20rem;
}
.zhineng-kefu {
  position: fixed;
  right: 3rem;
  bottom: 3rem;
  width: 4.56rem;
  height: 4.56rem;
  border-radius: 2.5rem;   
  font-size: 1.1rem;
  cursor: pointer;
  z-index: 2;
  background: #354664;
  line-height: 4.56rem;
  text-align: center;
  color: #fff;
  background: url("./assets/img/kf.png") no-repeat center center / 4.56rem
    4.56rem;
}
</style>
